﻿<template>
  <div>
    <!--表格页面  @removeSubmit="removeSubmit"  deleteAction="AllowAnonymous" -->
    <my-table ref="projectinstanceTable"  :hasSelect="false" :columns="columns" :loading="loading" :dataSource="dataSource" title="已绑定项目列表" @loadData="loadData">
      <template slot="titleBtns">
        <a-space>
          <a-button type="primary" icon="plus-circle" @click="handleSelected">选择项目</a-button>
          <a @click="handleRollback"> <a-icon type="rollback" /> 返回 </a>
        </a-space>
      </template>
    </my-table>
    <!--修改页面-->
    <modify v-if="modifyProjectInstanceEntity.showModify" @handleRefresh="handleRefresh" :modifyProjectInstanceEntity="modifyProjectInstanceEntity" />
  </div>
</template>

<script>
import modify from "./modify";
import myTable from "_c/myTable/index";
import {
  projectinstanceColumns,
  queryProjectinstancePage,
  deleteProjectinstance,
} from "./projectinstance";
export default {
  name: "Projectinstance",
  components: { modify, myTable },
  props: {
    modifyEntity: {
      type: Object,
      required: true,
      default: function () {
        return {
          // 传递的主键
          id: '',
          // 是否展示编辑页面
          showModify: false,
          // 标题
          title: '',
        };
      },
    },
  },
  data() {
    return {
      modifyProjectInstanceEntity: {
        // 传递的主键
        id: "",
        // 是否展示编辑页面
        showModify: false,
        // 标题
        title: '',
      },
      // 加载动画
      loading: false,
      // 绑定的数据源
      dataSource: [],
      // 表格绑定的列
      columns: projectinstanceColumns,
    };
  },
  mounted() {
    console.log(this.modifyEntity.id)
    this.loadData();
  },
  methods: {
    handleRollback() {
      this.$emit("handleRollback");
    },
    //#region 查询列表
    // 保存/修改后刷新表格
    handleRefresh() {
      this.modifyProjectInstanceEntity.showModify = false;
      this.$refs.projectinstanceTable.pagination.current = 1;
      this.loadData();
    },
    // 加载数据
    loadData() {
      this.loading = true;
      let that = this;
      let queryParams = {
        current: this.$refs.projectinstanceTable.pagination.current,
        pageSize: this.$refs.projectinstanceTable.pagination.pageSize,
      };
      queryProjectinstancePage(queryParams)
        .then((res) => { 
          let { data, totalCount } = res.data;
          that.dataSource = data;
          this.$refs.projectinstanceTable.pagination.total = totalCount;
          that.loading = false;
        })
        .catch(() => {
          that.loading = false;
        });
    },
    //#endregion

    //#region 选择
    // 打开选择页面
    handleSelected() {
      this.modifyProjectInstanceEntity = {
        id: this.modifyEntity.id,
        showModify: true,
        title: '选择项目'
      };
    },
    //#endregion
  },
};
</script>
